<template>
  <a-modal :visible="visible" title="历史版本" width="1352px" :footer="null" @cancel="handleCancel">
    <DynamicTable :tables="dyTable" :config="dyTableConfig" />
  </a-modal>
</template>

<script lang="ts" setup>
import { reactive, getCurrentInstance, onBeforeUnmount } from 'vue';
import { DynamicTable } from '@/components/public-template';
import indexService from './historyDetail.service';
import { Api, advancedQueryPreviewByVersionId } from '@/config/api/fileQuery';
import { filter } from 'rxjs/operators';

const { proxy }: any = getCurrentInstance();
const props = defineProps({
  data: Object,
  visible: {
    type: Boolean,
    default: false
  }
});
const emit = defineEmits(['update:visible']);
const dyTable: any = reactive(indexService.getTables());
const dyTableConfig: any = {
  name: 'historyDetailTable',
  style: 'table',
  protType: 'post',
  queryUrl: Api.advancedQueryVersionPageByFileId,
  params: { id: props.data?.id }
};

const subscribeSub = proxy.$NotificationPubSub
  .getParams()
  .pipe(filter((res) => res !== 0))
  .subscribe((item: any) => {
    console.log('subscribe item2', item);
    if (item.key === 'DYNAMICLOCALTABLE' && item.value.part.state.name === 'detailPreview') {
      advancedQueryPreviewByVersionId(item.value.data.id, {}).then((res) => {
        if (res && res.success) {
          window.open(res.data);
        }
      });
    }
  });

function handleCancel() {
  emit('update:visible', false);
}
onBeforeUnmount(() => {
  subscribeSub && subscribeSub.unsubscribe();
  proxy.$NotificationPubSub.clearParams();
});
</script>

<style lang="less" scoped></style>
